@import url(common.less);

.menu-switch,.price-label,.card-icon,.search-icon,.more,.top-icon-0,.top-icon-1,.top-icon-2,.top-icon-3,
.foot-icon-0,
.foot-icon-1,
.foot-icon-2,
.foot-icon-3,
{
  .bg-size('index_icon.png',172px,auto);
}
.page-head{
  .bg-color(#fff);
  .box-shadow(0 0 4px #000);
  .pr;
  z-index:2;
  header{
    .h(35px);
    .p10;
    .pr;
    z-index:3;
  }
  .search-box{
    padding:0 40px;
    height:100%;
    .cont{
      .bg-color(#efefef);
      .border-radius(4px);
      height:100%;
      .pl(30);
      .pr;
    }
    .search-icon{
      .dba(20,20);
      background-position:-72px 0;
      .pa(10px,8px);
    }
    .search-input{
      background:none;
      padding:0;
      .wh(100%,100%);
      border:none;
    }
  }
  .menu-switch{
    .pa(10px,10px);
    .dba(30,30);
    background-position:4px 6px;
  }
  .card-icon{
    .par(10px,10px);
    .dba(30,30);
    background-position:-33px 6px;
    .num{
      background-color:#ee4e4e;
      color:#fff;
      padding:0 4px;
      font-size:10px;
      border-radius:5px;
      .par(-5px,-2px);
      .wh(auto,12px);
      line-height:100%;
    }
  }
  .nav-top{
    padding:10px 0;
    transition:all .8s;
    .pa(0,-67px);
    .w(100%);
    .bg-color(#fff);
    li{
      .fl;
      .w(25%);
    }
    a{
      .db;
      .tc;
    }
    .icon{
      .dba(28,28);
      .ma();
      padding-bottom:5px;
    }
  }
  .nav-top-on{
    top:0;
  }
}
.menu-switch-on{
  transform:rotate(90deg);
  transition:all .8s;
}

.top-icon-0{
  background-position:1px -29px;
}
.top-icon-1{
  background-position:-45px -29px;
}
.top-icon-2{
  background-position:-145px -27px;
}
.top-icon-3{
  background-position:-95px -29px;
}

.footer{
  .bg-color(#21222a);
  .ptb();
  position:fixed;
  left:0;
  bottom:0;
  z-index:2;
  .w(100%);
  li{
    .fl;
    .w(25%);
    .tc;
  }
  a{
    .db;
    .c(#a6a7aa);
  }
  .on{
    .c(#face01);
  }
  i{
    .dba(28,20);
    .ma();
    padding-bottom:5px;
  }
}
.foot-icon-0{
  background-position:1px -72px;
}
.foot-icon-1{
  background-position:-36px -71px;
}
.foot-icon-2{
  background-position:-108px -72px;
}
.foot-icon-3{
  background-position:-145px -72px;
}
.goods-collection{
  box-shadow:0 0 3px #bbb;
  .cover{
    .oh;
    .pr;
    .h(240px);
    .cont{
      .pa();
      .wh(100%,100%);
      .tc;
      .c(#fff);
    }
    .tit{
      .pt(60);
      .fz(24);
    }
    .desc{
      .pt(10);
      .fz(16);
    }
    .btn-0{
      .mt(20);
      display:inline-block;
      padding:5px 10px;
    }
    .line{
      .wh(30px,2px);
      border-bottom:1px solid #fff;
      .ma();
      .pt10;
    }
    .sjx{
      bottom:-5px;
      top:auto;
    }
  }
  .cover-img{
    .wh(100%,240px);
  }
  .list{
    .ptb(10);
    .w(100%);
    overflow-x:auto;
    ul{
      white-space:nowrap;
      -webkit-overflow-scrolling:touch;
    }
    li{
      display:inline-block;
      .w(116px);
      .plr(5);
      .lh(26);
      .tc;
    }
    .pic{
      .wh(116px,116px);
    }
    .tit{
      .mt10;
      .fz(14);
      .c(#4a4a4a);
    }
    .desc{
      .c(#c5c5c5);
    }
    .price{
      .c(#4a4a4a);
    }
  }
}

.white-line-btn{
  .bd(#fff);
  .cw;
}

.index-box{
  border-top:10px solid #e5e6e7;
}

.all-goods{
  .pt(20);


}
.goods{
  .bg-color(#e5e6e7);
  padding:5px;
}
.goods-list{
  li{
    .fl;
    .w(50%);
    padding:5px;
    .box-sizing();
    a{
      .db;
      .bg-color(#fff);
      .bd(#b3b3b3);
      .tc;
      box-shadow:0 0 5px #b3b3b3;
      .lh(24);
    }
    .pic{
      .w(100%);
    }
    .tit{
      .fz(14);
      font-weight:normal;
    }
    .desc{
      .c(#c5c5c5);
    }
    .price{
      .fb;
      line-height: normal;
      .ptb(5);
      span{
        display:inline-block;
      }
    }
  }
}
.price-label{
  .dib(24,12);
  .fz(6);
  .cw;
  .ml(10);
  vertical-align:middle;
}
.hot-label{
  background-position:-100px 0;
}
.down-label{
  background-position:-148px 0;
}
.foot-section{
  .h(60px);
}
.main{
  position:absolute;
  left:0;
  top:55px;
  right:0;
  bottom:0;
  overflow-y:auto;
}
.news-goods{
  .plr(10);
}
.new-goods-list{
  li{
    .mt10;
    .bd(#e4e4e4);
  }
  .tit{
    .fz(18);
    .mt10;
    .plr();
  }
  .desc{
    .plr();
    .fz(12);
    .c(#c5c5c5);
    .lh(30);
  }
  .btn{
    .fr;
  }
  .bottom{
    padding:0 10px 10px 10px;
    .lh(40);
  }
  .now-price{
    .fz(16);
  }
  .original-price{
    text-decoration:line-through;
    .c(#b5b5b5);
    .ml(10);
  }
}
.btn{
  .dba(80,40);
  .tc;
  border-bottom:3px solid #d16464;
  .border-radius(20px);

}
.red-btn{
  .cw;
  .bg-color(#f66a6a);
}
.class-item{
  .pic{
    .pr;
    img{
      .wh(100%,100px);
    }
    h2{
      .w(100%);
      .pa(0,40px);
      .fz(24);
      .cw;
      .tc;
    }

  }
}
.class-second-nav{
  .pr;
  padding:20px 5px 10px;
  .bg-color(#b9b7b7);
  .sjx{
    .wh(10px,10px);
    transform:rotate(45deg);
    .pa(50%,-5px);
    .ml(-5);
    .bg-color(#b9b7b7);

  }
  li{
    .fl;
    .box-sizing();
    .w(25%);
    .plr(5);
    .pb(10);
  }
  a{
    .dib(79,30);
    .w(100%);
    .bd(#000);
    .fz(16);
    .border-radius();
    .tc;
    .bg-color(#fff);

  }
}
.opacity-bg{
  .pa();
  .wh(100%,100%);
  .bg-color(rgba(0,0,0,0.4));
}
.topic-top{
  .pr;
  .pic{
    .wh(100%,242px);
  }
  .words{
    .pa(0,100px);
    .w(100%);
    .cw;
    .tc;
    letter-spacing:6px;
    word-spacing:10px;
  }
  .tit{
    .fz(28);
  }
  .desc{
    .mt10;
    .fz(16);
  }
}
.topic-description{
  .pr;
  padding:20px;
  .c(#9f9f9f);
  .lh(24);
  .fz(16);
}
.sjx{
  .wh(10px,10px);
  transform:rotate(45deg);
  .pa(50%,-5px);
  .ml(-5);
  .bg-color(#fff);
}
.yellow-line{
  border-bottom:5px solid #ffd102;
  .w(120px);
  margin:30px auto 0;
}
.search-tab{
  .ptb();
  .bg-color(#efefef);
  a{
    .db;
    .fl;
    .w(33%);
    border-right:1px solid #d4d4d4;
    .dl(30);
    .tc;
    .c(#a8a8a8);
    &:last-child{
      border:0;
    }
  }
  .on{
    .c(#000);
  }
}